<script lang='ts' setup>
import { reactive,onMounted,ref} from 'vue'

const props = withDefaults(defineProps<{
    tableData: Array<any>
	previewInfo: Function
}>(), {
    tableData: () => ([
        {
            id:1,
            name: '雁塔店',
			productId: 4566,
			productImg: 'img',
			brand: '阿迪达斯',
            productName: '名称',
            productType: '类型',
			spec: '规格',
			cellPrice: '销售价格',
			count: '寄存数量',
			debtMoney: '负债金额',
			productCost: '成本',
        }
    ]),
	previewInfo: (id: number) => {}
})

const previewInfo = (id: number) => {
	props.previewInfo(id)
}
</script>

<template>
    <main>
        <el-table :data="props.tableData" style="width: 100%">
				<el-table-column label="门店名称" prop="name" />
				<el-table-column label="商品ID" prop="productId" />
				<el-table-column label="商品图片" prop="productImg" />
				<el-table-column label="品牌" prop="brand"  />
				<el-table-column label="商品名称" prop="productName" />
				<el-table-column label="商品类型" prop="productType"  />
				<el-table-column label="商品规格" prop="spec" /> 
				<el-table-column label="销售价格" prop="cellPrice" />
				<el-table-column label="寄存数量" prop="count"  />
				<el-table-column label="负债金额" prop="debtMoney" />
				<el-table-column label="商品成本" prop="productCost"  />
				<el-table-column label="操作">
					<template #default="scope">
						<el-link :underline="false" type="primary" @click="previewInfo(scope.row.id)">查看详情</el-link>
					</template>
				</el-table-column>
			</el-table>
    </main>
</template>

<style lang='scss' scoped>

</style>